import React, { Component } from 'react';
import { category_list, category_subcate } from '../utils/api'
import context from '../utils/context';
class TabLeft extends Component {
    state = {
        currentIndex: 0,
        tablist: [],
        goodslist: []
    }
    componentDidMount() {
        category_list().then((res) => {
            this.setState({
                tablist: res.data.list
            })
            context.emit('saveId',res.data.list[0].id);
        })
       
        
    }
    handleclick(id,index) {
        context.emit('saveId',id,index);
        this.setState({
            currentIndex: index,            
        })
        // category_subcate({id}).then((res)=>{
        //     this.setState({goodslist:res.data.subcate.subcategory})
        // })
    }
    render() {
        return (
            <div className='tableft'>
                {
                    this.state.tablist.map((item, index) => {
                        return (
                            <div className={"tab " + (this.state.currentIndex == index ? "active" : "")} onClick={() => { this.handleclick(item.id,index) }} key={index}>
                                {item.name}
                            </div>
                        )
                    })
                }
            </div>
        );
    }
}

export default TabLeft;